<template>
  <!--  <van-search-->
  <!--      v-model="searchText"-->
  <!--      placeholder="请输入队伍名称"-->
  <!--      @search="listTeam"-->
  <!--  />-->
  <form action="/public">
    <van-search
        v-model="searchText"
        show-action
        placeholder="请输入队伍名称"
        @search="onSearch"
    />
  </form>
<!--  <van-button type="primary" @click="doAddTeam">加入队伍</van-button>-->
  <team-card-list :teamList="teamList" @update:teamList="teamList = $event"/>
</template>

<script setup lang="ts">

import TeamCardList from "../../global/TeamCardList.vue";
import {onMounted, ref} from "vue";
import myAxios from "../../plugins/myAxios.ts";
import {showSuccessToast} from "vant";

const searchText = ref('');

const teamList = ref([]);

/**
 * 搜索队伍
 * @param val
 * @returns {Promise<void>}
 */
const listTeam = async (val = '') => {
  const res = await myAxios.get("/team/list/my/join", {
    params: {
      searchText: val,
      pageNum: 1,
    },
  });
  if (res?.code === 0) {
    teamList.value = res.data;
  } else {
    showSuccessToast('加载队伍失败，请刷新重试');
  }
}


// 页面加载时只触发一次
onMounted( () => {
  listTeam();
})

const onSearch = (val) => {
  listTeam(val);
};

</script>


<style scoped>

</style>